<template>
  <div style="font-size: 16px; text-align: center">
    <span style="padding-left: 95px; font-size: 20px">修改个人信息</span>
    <span style="padding-left: 50px" @click="ok">保存</span>
    <van-checkbox
      v-for="(item, index) in data"
      :key="index"
      shape="square"
      @change="change"
      v-model="item.checked"
      checked-color="#ee0a24"
      >{{ item.name }}</van-checkbox
    >
  </div>
</template>

<script>
import { edituser, getuser } from "../../../../request/http";

export default {
  name: "",
  components: {},
  props: [],
  data() {
    return {
      data: [
        { name: "语文", checked: false, attr_id: 2, attr_val_id: 7 },
        { name: "数学", checked: false, attr_id: 2, attr_val_id: 8 },
        { name: "英语", checked: false, attr_id: 2, attr_val_id: 9 },
        { name: "物理", checked: false, attr_id: 2, attr_val_id: 12 },
        { name: "化学", checked: false, attr_id: 2, attr_val_id: 13 },
        { name: "生物", checked: false, attr_id: 2, attr_val_id: 24 },
        { name: "政治", checked: false, attr_id: 2, attr_val_id: 25 },
        { name: "信息技术", checked: false, attr_id: 2, attr_val_id: 26 },
      ],
      arr: [],
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {
    getuser().then((res) => {
      console.log(res);
      for (var i = 0; i < this.data.length; i++) {
        for (var j = 0; j < res.attr.length; j++) {
          if (this.data[i].name == res.attr[j].attr_value) {
            this.data[i].checked = true;
          }
        }
      }
      // for (var i in res.attr) {
      //   this.data[i].name == res.attr[i].attr_value
      //     ? (this.data[i].checked = true)
      //     : (this.data[i].checked = false);
      // }
    });
  },
  methods: {
    change(e) {
      var data = this.data.filter((res) => {
        return res.checked == true;
      });
      console.log(data);
      this.arr = data;
    },
    ok() {
      let data = JSON.stringify(this.arr);
      edituser({ user_attr: data }).then((res) => {
        console.log(res);
        this.$toast.success("修改成功");
        this.$router.go(-1);
      });
    },
  },
};
</script>

<style lang='scss' scoped>
.van-checkbox {
  margin-top: 10px;
}
</style>
